<template>
  <div>
    <div class="service-head">
      <div class="service-name">{{title}}</div>
      <div class="service-region fmt-text-light">
        <span class="area_service">服务适用范围：</span>
        <span style="font-size:14px;color: rgb(110, 161, 237)">{{area}}</span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props:{
    title: String,
    area: String
  }
};
</script>

<style>
.service-head {
  padding: 1.25rem;
  background-image: url('../assets/head-background.png');
  background-size: cover;
}
.service-name {
  font-size: 1.375rem;
  line-height: 1.625rem;
  color: rgb(39, 49, 64);
  font-weight: 500;
}
.service-region {
  margin-top: 0.625rem;
  line-height: 1.0625rem;
}
.area_service{
  font-size: 14px;
  color: #999;
}
</style>